<template>
  <div>
    <div class="top-topic">
      <!-- {{ info.saveName }} -->
      {{klName}}
      <span class="timeclass"></span>
    </div>

    <div class="question" v-for="(item,index)  in dataview" :key="index">
     <span>{{ item.No }}.</span>
      <div class="question-top" v-html="item.Test"></div>
      <div class="question-top" v-html="item.Analytic"></div>
      <!-- <div class="question-top" >正确答案： <span v-html="item.Answer"></span></div> -->
      <div class="question-top">您的答案：<span  style="color: #0AAF60;">{{ item.AnswerText }}</span></div>
    </div>
  </div>
</template>
<script lang="ts" setup>
import { ref, reactive, onMounted, watch } from "vue";
import { useRouter, useRoute } from "vue-router";
import { RecordwrongTestList } from "@/api/practise";
const router = useRouter();
const route = useRoute();
const idname = reactive({
  id: 0,
});
const dataview = ref() 
const klName = ref()
const ajxsviewth = () => {
    idname.id = Number(route.query.klID);
  RecordwrongTestList(idname).then((res: any) => {
    dataview.value =res.list.test
    klName.value = res.list.klName
  });
};
onMounted(() => {
  
  ajxsviewth();
});
</script>
<style lang="less" scoped>
.top-topic {
  height: 5rem;
  line-height: 81px;
  padding: 0 1vw;
  font-weight: bold;
  font-size: 1.1vw;
  color: #03305c;
  border-bottom: 1px solid #ededed;
  background-color: #fff;
}
.question {
//   height: 200px;
  margin: 1vw;
  padding: 1vw;
  border: 1px solid #ebebeb;
  // background-color: pink;
  .question-top {
    // height: 2vw;
    margin-top: 1vw;
    // line-height: 2vw;
    // background-color: pink;
  }
}
</style>
